<page-grid>
    <div nz-row nzGutter="16">
        <div nz-col nzSpan="4">
            <ng-container *ngIf="nodes.length !== 0; else loadingTemplate">
                <nz-input-group [nzSuffix]="suffixIcon">
                    <input type="text" nz-input placeholder="请输入部门名称" [(ngModel)]="deptName" />
                </nz-input-group>
                <ng-template #suffixIcon>
                    <span nz-icon nzType="search"></span>
                </ng-template>
                <div class="organization-nz-tree-container scrollbar">
                    <nz-tree
                        [nzData]="nodes"
                        [nzSearchValue]="deptName"
                        (nzClick)="nzEvent($event)"
                        nzShowLine
                        [nzExpandAll]="nzExpandAll"
                        nzVirtualHeight="500px"
                        [nzSelectedKeys]="checkedKeys"
                    />
                </div>
            </ng-container>
            <ng-template #loadingTemplate>
                <nz-skeleton *ngFor="let item of 3 | times" [nzActive]="true" />
            </ng-template>
        </div>
        <div nz-col nzSpan="20">
            <sf
                #sf
                mode="search"
                [schema]="searchSchema"
                autocomplete="off"
                [formData]="params"
                (formSubmit)="searchDataGet($event)"
                (formReset)="reSetDataGet(params)"
            />
            <div space-card>
                <button nz-button *aclIf="['admin', 'system:user:add']" [nzType]="'primary'" (click)="addUser()">
                    <i nz-icon nzType="plus" nzTheme="outline"></i>新增
                </button>
                <button
                    nz-button
                    [disabled]="!singleCheckedItem"
                    *aclIf="['admin', 'system:user:edit']"
                    [nzType]="'primary'"
                    (click)="editUser(singleCheckedItem)"
                >
                    <i nz-icon nzType="edit" nzTheme="outline"></i>修改
                </button>
                <button
                    nz-button
                    [disabled]="!(multipleCheckedItems.length > 0)"
                    *aclIf="['admin', 'system:user:remove']"
                    [nzType]="'primary'"
                    nzDanger
                    (click)="delUserS(multipleCheckedItems)"
                >
                    <i nz-icon nzType="delete" nzTheme="outline"></i>删除
                </button>
                <button nz-button *aclIf="['admin', 'system:user:import']"><i nz-icon nzType="upload" nzTheme="outline"></i>导入 </button>
                <button nz-button *aclIf="['admin', 'system:user:export']">
                    <i nz-icon nzType="download" nzTheme="outline"></i>导出
                </button>
            </div>
            <st
                #st
                [bordered]="bordered"
                [data]="url"
                [req]="reqReName"
                [res]="resReName"
                [ps]="ps"
                [columns]="columns"
                [scroll]="scroll"
                [size]="tableSize"
                [page]="pageSet"
                [widthMode]="widthMode"
                (change)="simpleTableCheck($event)"
            >
                <ng-template st-row="statusCustom" let-item let-index="index">
                    <nz-switch
                        nz-popconfirm
                        [nzPopconfirmTitle]="getPopConfirmText(item)"
                        nzPopconfirmPlacement="top"
                        (nzOnConfirm)="confirmStatus(item, index)"
                        (nzOnCancel)="cancelStatus(item, index)"
                        [ngModel]="item.status === '0'"
                    />
                </ng-template>
            </st>
        </div>
    </div>
</page-grid>
